import React, {useState} from "react";

interface AppStateValue {
    username: string,
    shoppingCart: {items:{id:number,name:string}[]}
}

const defaultContextValue:AppStateValue = {
    username:'Break',
    shoppingCart:{ items:[] }
}

export const appContext = React.createContext(defaultContextValue)
export const appSetContext = React.createContext<undefined| React.Dispatch<React.SetStateAction<AppStateValue>>>(undefined)

export const AppStateProvider:React.FC = (props)=>{
    const [state,setState] = useState(defaultContextValue)
    return(
        <appContext.Provider value={state}>
            <appSetContext.Provider value={setState}>
                {props.children}
            </appSetContext.Provider>
        </appContext.Provider>
    )
}
